﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
		<title>长连接测试</title>
		<script language="javascript" type="text/javascript" src="WebSocket.js"></script>
		<link rel="stylesheet" type="text/css" href="WebSocket.css" />
		<script language="javascript" type="text/javascript">
			$(document).ready(function ()
			{
				$('#div-msg').append('ws://' + location.host + '/WebSocket');
				$('#btn-ws').click(function ()
				{
					var ws = $(this).data('ws');
					if (!ws)
					{
						var url = $('#txt-url').val().replace(/^\s+|\s+$/img, ''); ;
						if (url == '')
							url = 'ws://' + location.host + '/WebSocket';
						ws = new WebSocket(url);
						ws.onopen = function (e)
						{
							$('#div-msg').after('\r\n<br/>WS Open.');
							$('#btn-msg').removeAttr('disabled');
							$('#btn-ws').data('ws', this);
							$('#btn-ws').text('Close WebSocket');
						};
						ws.onclose = function (e)
						{
							$('#div-msg').after('\r\n<br/>WS Close.');
							$('#btn-msg').attr('disabled', 'disabled');
							$('#btn-ws').data('ws', null);
							$('#btn-ws').text('Open WebSocket');
						};
						ws.onmessage = function (e)
						{
							$('#div-msg').after('\r\n<br/>WS Receive:' + e.data);
						};
						ws.onerror = function (e)
						{
							$('#div-msg').after('\r\n<br/>WS Error:' + e.data);
						};
						$('#div-msg').after('\r\n<br/>WS try open:' + ws);
						return;
					}

					if (!confirm('Close it?'))
						return;

					ws.close();
				});
				$('#btn-msg').click(function ()
				{
					var ws = $('#btn-ws').data('ws');
					if (!ws)
						return;

					ws.send($('#txt-msg').val());
				});
				$('#div-msg').append('\r\n<br/>OK!');
			});
		</script>
	</head>
	<body>
		<div>
		<table class="form" cellpadding="4" cellspacing="1">
		<tr>
		<td colspan="2"><textarea id="txt-msg" rows="10" cols="100"></textarea></td>
		</tr>
		<tr>
		<th>WebSocket url:</th>
		<td><input type="text" id="txt-url" title="WebSocket:&#x0D;&#x0A;&#x09;远程地址；为空表示当前地址。" /></td>
		</tr>
		<tr>
		<td><button id="btn-msg" disabled="disabled">Send WebSocket Message</button></td>
		<td style="text-align: right;"><button id="btn-ws">Open WebSocket</button></td>
		</tr>
		<tr>
		<td colspan="2">
		<div id="div-msg" style="padding-left: 64px;">&nbsp;</div>
		</td>
		</tr>
		</table>
		</div>
	</body>
</html>
